<template>
  <base-breadcrumb>
    <template>
      <a-card>
        <titleName title="信息详情" ></titleName>
        <a-form-model
          ref="ruleForm"
          :model="form"
         
          :hideRequiredMark="true"
          :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
          :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
        >
          <a-row :gutter="24">
            <a-col :md="8" :sm="8">
              <a-form-model-item label="名称：" prop="branchComId">
                <span>{{form.name}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="所属项目：" prop="branchComId">
                <span>{{form.projectName}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="所属公司：" prop="branchComId">
                <span>{{form.branchComName}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="合同额（元）：" prop="branchComId">
                <span>{{form.contractValue}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="发包人确认工程量（元）：" prop="branchComId">
                <span>{{form.confirmsProjectQuantity}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="结算基本值（元）：" prop="branchComId">
                <span>{{form.basicSettlementValue}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="结算保底值（元）：" prop="branchComId">
                <span>{{form.settlementGuarantee}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="结算报送值（元）：" prop="branchComId">
                <span>{{form.settlementReportValue}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="实际成本（元）：" prop="branchComId">
                <span>{{form.actualCost}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="已收款（元）：" prop="branchComId">
                <span>{{form.paidFor}}</span>
              </a-form-model-item>
            </a-col>
            <!-- <a-col :md="8" :sm="8">
              <a-form-model-item label="交底日期：" prop="branchComId">
                <span>{{form.confessionDate}}</span>
              </a-form-model-item>
            </a-col> -->

            <a-col :md="8" :sm="8">
              <a-form-model-item label="当前状态：" prop="branchComId">
                <span v-if="form.auditStatus === 'DRAFT'">草稿</span>
                <span v-if="form.auditStatus === 'SUBMITTED'">已提交</span>
                <span v-if="form.auditStatus === 'PAST'">通过</span>
                <span v-if="form.auditStatus === 'REJECTED'">驳回</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="填报人：" prop="branchComId">
                <span>{{form.createName}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="8">
              <a-form-model-item label="填报时间：" prop="branchComId">
                <span>{{form.createTime}}</span>
              </a-form-model-item>
            </a-col>
            <a-col :md="24" :sm="24">
              <a-form-model-item label="附件：" prop="branchComId">
                <div class="f-col">
                  <span v-for="(item,index) in form.fileInfoVOList" :key="index">
                    {{item.fileName}} &nbsp;
                    <!-- <a @click="check()">查看</a>&nbsp; -->
                    <a
                      :href="'/api/ycloud-file-center/oper/download?access_token='+token+'&fileId='+item.fileId"
                    >下载</a>
                  </span>
                </div>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </a-card>
           <div class="tool-btns mb20 page-btn-right-top">
             
                <a-button type="primary" @click="closeForm">关闭</a-button>
            </div>
    </template>
  </base-breadcrumb>
</template>
<script>
import { getSettlementPlan } from '@/api/businessAffairs/revenueAndCost'
import Vue from 'vue'
export default {
    name:'a'+Date.now(),
    data() {
        return {
            id: '',
            form: {},
            token: '',
        }
    },
    mounted() {
        this.token = Vue.getAcloudProvider().getAccessToken()
        this.id = this.$route.query.id
        console.log(this.id)
        this.getSettlementPlan()
    },
    methods: {
             // 关闭表单
        closeForm() {
            this.$multiTab.close(this.$route.fullpath);
          
        },
        getSettlementPlan() {
            let params = {
                id: this.id,
            }
            getSettlementPlan(params).then((res) => {
                this.form = res.data
                console.log(this.form)
            })
        },
    },
}
</script>
<style lang="less" scoped>
@deep: ~'>>>';
.tool-btns {
    display: flex;
    justify-content: flex-end;
    @{deep} .ant-btn + .ant-btn {
        margin-left: 12px;
    }
}
.step-text {
    .ant-steps-item-title {
        width: 168px;
    }
}
.f-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.f-col .ant-form-item-label {
    text-align: left;
}
.check-box {
    .ant-checkbox-group {
        margin-top: 1.5%;
        display: flex;
        justify-content: space-between;
    }
    .ant-checkbox-group-item {
        position: static !important;
    }
}
.radio-box {
    .ant-radio-wrapper {
        position: static !important;
    }
    .ant-radio-group {
        margin-top: 3% !important;
        display: flex;
    }
}

.foot-btn {
    display: flex;
    justify-content: space-between;
}
.my-table {
    border: 1px solid #e6e6e6;
}
</style>